<template>
  <div class="standingBook">
    <div class="title"><span>在所人数:</span><span class="titleNumber">{{ people }}</span></div>
    <grand-total
    :grandTotalNum="grandTotal"
    />
  </div>
</template>

<script>
import {PrisonList} from './management'
import grandTotal from "@views/sjsk/management/plan/grandTotal";
export default {
  name: "standingBook",
  components:{ grandTotal },
  mixins:[PrisonList],
  data(){
    return {
      people:100,
      grandTotal:[
        {
          title:'开启个案人数',
          percent:22,
          number:15,
          color:{
            '0%': '#108ee9',
            '100%': '#F07E91',
          }
        },
        {
          title:'美沙酮治疗人数',
          percent:75,
          number:20,
          color:{
            '0%': '#108ee9',
            '100%': '#A87BE5',
          }
        },
        {
          title:'政府救助人数',
          percent:98,
          number:28,
          color:{
            '0%': '#108ee9',
            '100%': '#F7D85B',
          }
        },
        {
          title:'帮教谈心人数',
          percent:55,
          number:15,
          color:{
            '0%': '#108ee9',
            '100%': '#6DD18B',
          }
        },
        {
          title:'心里辅导人数',
          percent:35,
          number:38,
          color:{
            '0%': '#108ee9',
            '100%': '#5AD1D1',
          }
        },
        {
          title:'风险评估人数',
          percent:46,
          number:15,
          color:{
            '0%': '#108ee9',
            '100%': '#5DAFFB',
          }
        }
      ]
    }
  }
}
</script>

<style scoped>
.standingBook{
  background-color: #FFFFFF;
}
.title {
  padding: 20px;
  font-size: 20px;
  font-weight: 700;
  border-bottom: 1px  solid  #E9E9E9;
}
.titleNumber{
  color: #1890FF;
  font-size: 25px;
  font-weight: bolder;
}
</style>